<template>

  <div class="page">
    <!-- <mt-header :title="this.$route.name" fixed>
      <div v-if="this.$route.meta.showleft" @click='$router.go(-1)' slot="left">
        <mt-button icon="back"></mt-button>
      </div>
    </mt-header> -->
      <heads></heads>
      <div class="page-content" style="width: 100%;background: #fff">
      <div style="padding-top: 1px" class="form-content">
        <h3 class="tit">官方支付方式</h3>
        <form>
          <p style="margin-bottom: 20px;">
            <input id="inputcoin" type="text" name="inputcoin"  :value="this.$route.query.money" disabled class="form-control" placeholder="请输入金币" required>

          </p>


          <div class="ca-channel-link "  v-bind:class="{ actives: isActive==1}" @click="activeMg(1)">
            <span class="ca-channel-icon" ></span>
            <span class="">支付宝</span>
            <b class="ca-channel-checkbox"></b>
          </div>
          
         <!-- <div class="ca-channel-link" v-bind:class="{ actives:isActive==2}" @click="activeMg(2)">
            <span class="ca-wx-icon" ></span>
            <span class="">微信支付</span>
            <b class="ca-channel-checkbox"></b>
          </div> -->
          <!--  <div class="ca-channel-link" v-bind:class="{ actives:isActive==3}" @click="activeMg(3)">
            <span class="ca-wx-icon" ></span>
            <span class="">QQ支付</span>
            <b class="ca-channel-checkbox"></b>
          </div> -->
           <!-- <div class="ca-channel-link "  v-bind:class="{ actives: isActive==4}" @click="activeMg(4)">
            <span class="ca-channel-icon" ></span>
            <span class="">支付宝</span>
            <b class="ca-channel-checkbox"></b>
          </div> -->
          <button type="button" id="demoBtn1" class="pay-btn" @click="btnPay()">确认购买</button>
        </form>




    </div>
      </div>
  </div>
</template>
<script>
import heads from '../components/header'
  import { Loadmore,Toast ,MessageBox } from 'mint-ui';
  import MtButton from "../../node_modules/mint-ui/packages/button/src/button";
  export default {
    data(){
      return{
        isActive:1,
        type:1,
        money:this.$route.query.coin,
        goodsname:'',
        istype:'',
        key:'',
        notify_url:'',
        orderid:'',
        orderuid:'',
        price:'',
        return_url:'',
        uid:'',
      }
    },
    components: {
 heads,
      MtButton,

    },
    mounted() {

    },
    methods:{
      prizeShop:function (c) {
        var _this=this;
      },
      activeMg:function (i) {
        switch (i){
          case 1:
            this.isActive=1
            this.type=1
            break
          case 2:
            this.isActive=2,
            this.type=2
            break
          case 3:
            this.isActive=3,this.type=3
            break
          case 4:
             this.isActive=4,this.type=1
            break
        }
        // return i==1?(this.isActive=1,this.type=1):i==2?(this.isActive=2,this.type=2):(this.isActive=3,this.type=3)
      },
      btnPay: function() {

        var _this=this;
        if(this.isActive==4){
           _this.yunPay()
        }else{
           _this.swifPay()
        }
        // console.log( this.isActive+'+++++++'+this.type)
      },
      swifPay:function(){
         var _this=this;
         this.$http(this.API.pay,{
            data:{ coin :_this.money,
              istype :_this.type,}
          }).then(function(data){
              if(data.flag==1){
                  window.location.href=data.data
              }
          }).catch(function(err) {
            console.log(err);
          });
      },
      yunPay:function(){
         var _this=this;
         this.$http(this.API.yunPay,{
            data:{
              coin :_this.money,
              istype :_this.type,
            }
          }).then(function(data){
              if(data.flag==1){
                  window.location.href=data.data
              }
          }).catch(function(err) {
            console.log(err);
          });
      },

    },

  }
</script>
<style>
  @import "../sass/pageScss/prize.scss";
</style>

